<template>
  <div class="r-list">
    <div class="r-row" v-for="i in 100" :key="i">
      <div class="left">
        <!-- <img src="../../../assets/images/timg.png" /> -->
        <van-image
          class="img"
          lazy-load
          :src="require('../../../assets/images/timg.png')"
        />
        <span>条框比基尼2222</span>
      </div>
      <div class="center">
        <p>订单号：1234567890858888888888888</p>
        <p>2019-12-12</p>
      </div>
      <div class="right">待处理</div>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    curIndex: {
      type: Number,
      default: 1
    }
  },
  data() {
    return {};
  },
  created() {
    console.log(this.curIndex);
  }
};
</script>

<style lang="scss" scoped>
.r-list {
  // margin-top: 45px;
  height: 100%;
  .r-row {
    display: flex;
    align-items: center;
    padding: 10px;
    border-bottom: 1px dashed #ddd;
    .left {
      width: 60px;
      display: flex;
      flex-direction: column;
      margin-right: 20px;
      .img {
        width: 100%;
      }
      span {
        width: 100%;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
      }
    }
    .center {
      flex: 1;
      height: 100%;
      p {
        width: 200px;
        line-height: 2.5;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
        font-size: 120%;
        &:nth-child(2) {
          color: #bdbdbd;
          font-size: 12px;
        }
      }
    }
    .right {
      margin-left: 10px;
      background-color: #eb7572;
      color: #fff;
      width: 60px;
      line-height: 30px;
      border-radius: 10px;
      text-align: center;
      white-space: nowrap;
    }
  }
}
</style>
